package com.hiray.wanandroid.ui.page

import androidx.compose.foundation.background
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.material.Divider
import androidx.compose.material.ScrollableTabRow
import androidx.compose.material.Tab
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import androidx.lifecycle.viewmodel.compose.viewModel
import androidx.paging.compose.collectAsLazyPagingItems
import com.google.accompanist.pager.ExperimentalPagerApi
import com.google.accompanist.pager.HorizontalPager
import com.google.accompanist.pager.rememberPagerState
import com.hiray.wanandroid.data.PublicViewModel
import kotlinx.coroutines.launch

private val TAG = "PulicPage"

@ExperimentalPagerApi
@Composable
fun PublicPage(viewModel: PublicViewModel = viewModel()) {
    Box(
        contentAlignment = Alignment.TopStart,
        modifier = Modifier
            .background(Color.Yellow)
            .fillMaxSize()
    ) {
        Column {
            val tabList = viewModel.publicListFlow.collectAsState(initial = emptyList())
            val scope = rememberCoroutineScope()
            if (tabList.value.isNullOrEmpty().not()) {
                val pagerState =
                    rememberPagerState(pageCount = tabList.value?.size ?: 0, 0, 0f, 1, false)
                ScrollableTabRow(selectedTabIndex = pagerState.currentPage) {
                    tabList.value?.forEachIndexed { index, item ->
                        Tab(selected = false, onClick = {
                            scope.launch {
                                pagerState.animateScrollToPage(index, 0f)
                            }
                        }) {
                            Text(text = item.name)
                        }
                    }
                }
                HorizontalPager(state = pagerState) { page ->
                    val id = tabList.value!![page].id
                    PublicArticleListPage(id)
                }
            }
        }
    }

}

@Composable
fun PublicArticleListPage(id: String, viewModel: PublicViewModel = viewModel()) {
    val lazyListState = viewModel.publicArticleListFlow(id).collectAsLazyPagingItems()

    LazyColumn {
        items(lazyListState.itemCount) { index ->
            Column {
                Text(
                    text = lazyListState[index]!!.title,
                    modifier = Modifier
                        .height(80.dp),
                    textAlign = TextAlign.Center
                )

                Divider(
                    Modifier
                        .background(Color.LightGray)
                        .fillMaxWidth()
                        .height(0.5.dp)
                )
            }
        }
    }
}
